<ion-header>
  <ion-toolbar>
    <ion-title>
      {{'DETAIL.TITLE' | translate}}
    </ion-title>
    <ion-buttons end>
      <button ion-button (click)="dismiss()">
        <span ion-text color="primary" showWhen="ios">{{'DETAIL.CLOSE' | translate}}</span>
        <ion-icon name="md-close" showWhen="android,windows"></ion-icon>
      </button>
    </ion-buttons>
  </ion-toolbar>
</ion-header>

<ion-content (ionScrollStart)="scrollStart($event)"  (ionScrollEnd)="scrollComplete($event)">
  <div>
    <img src="{{item?.imgMainUrl}}"/>
  </div>
  <p class="product-title">
    {{item.name}}
  </p>
  <p class="price-title">
    ￥{{item.price}}{{'DETAIL.UNIT' | translate}}
  </p>
  <p class="common-title">
    {{'DETAIL.INCLUDE' | translate}}：
  </p>
  <p class="common-title">
    {{item?.productName}}
  </p>
  <div class="common-title">
    <p>{{'DETAIL.FEATURE' | translate}}</p>
    <p>
      {{'DETAIL.CONTENT' | translate}}
    </p>
  </div>
  <div *ngIf="item.type === 1">
    <div *ngFor="let p of item?.productObjList">
      <ion-slides>
        <ion-slide>
          <img src="{{p.picUrl}}"/>
        </ion-slide>
      </ion-slides>
      <p class="product-title">
        {{p.name}}
      </p>
    </div>
  </div>

</ion-content>

<button *ngIf="!isShow" [@scroll]="status"  id="orderBtn" full class="order-btn" (click)="orderProduct(item.id)">{{'DETAIL.ORDER' | translate}}</button>
